<template>
	<view class="cash-apply">
		<view class="step">
			<u-icon name="checkmark-circle-fill" size="44rpx" color="#FF7803" class="icon line"></u-icon>
			<view style="margin-left: 28rpx;">
				<text>发起提现申请</text>
				<text class="tip">2023-02-10 16:10</text>
			</view>
		</view>
		<view class="step">
			<u-icon name="clock" size="44rpx" color="#000" class="icon line line999"></u-icon>
			<view style="margin-left: 28rpx;">
				<text>提现审核中</text>
				<text class="tip">2023-02-10 16:10</text>
			</view>
		</view>
		<view class="step">
			<u-icon name="checkmark-circle-fill" size="44rpx" color="#D8D8D8" class="icon"></u-icon>
			<view style="margin-left: 28rpx;">
				<text>到账成功</text>
				<text class="tip">预计3~5个工作日到账，节假日顺延</text>
			</view>
		</view>

		<view class="over-btn">
			完成
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #fff;
	}

	.cash-apply {
		width: 100vw;

		.step {
			display: flex;
			padding: 60rpx 0 0 60rpx;
			font-size: 28rpx;
			font-weight: 500;
			line-height: 40rpx;
			color: #333;

			.icon {
				vertical-align: middle;

				&.line {
					position: relative;

					&::after {
						position: absolute;
						top: 70%;
						left: 50%;
						content: '';
						display: block;
						width: 1rpx;
						height: 108rpx;
						background: #FF7803;
					}

					&.line999 {

						&::after {
							background: rgba(0, 0, 0, .1);
						}
					}
				}
			}

			.tip {
				display: block;
				font-size: 24rpx;
				font-weight: normal;
				color: #999;
			}
		}

		.over-btn {
			width: 690rpx;
			margin: 160rpx auto;
			text-align: center;
			line-height: 88rpx;
			border-radius: 44rpx;
			background: #FF7803;
			color: #fff;
		}
	}
</style>
